<div class="material_holiday" id="material_holiday2">
	<ul class="material_holiday_nav js_material_holiday">
		<div class="hover-line"></div>
        <li class="mth_filter js_mth_filter active">
        	<a class="">样式</a>
        	<ul class="dropdown-menu">
        		<li><a class="js_mt_filter" data-filter=".cut_line">分割线</a></li>
        		<li><a class="js_mt_filter" data-filter=".material_attention">引导关注</a></li>
        		<li><a class="js_mt_filter" data-filter=".tagtpl-107,.tagtpl-229,.tagtpl-237,.tagtpl-233,.tagtpl-232">标题</a></li>
        		<li><a class="js_mt_filter" data-filter=".material_text">正文</a></li>
        		<li class="hide"><a class="js_mt_filter" data-filter=".material_qrcode">签名</a></li>
        	</ul>
        </li>
        <li class="mth_filter js_mth_filter" data-filter="[filter-name='qrcode']"><a class="">图片</a></li>
    </ul>
    <div class="material_holiday_container">
    	<ul class="material_holiday_list">
    		<include file="./Application/Home/View/Common/editor_material/festival/htmlStyle/content_ICD.html" />
    	</ul>
    	<div class="img_container">
			<include file="./Application/Home/View/Common/editor_material/festival/imageStyle/image_ICD.html" />
    	</div>
    </div>
</div>
<script type="text/javascript">
$(function() {
	var self = $('#material_holiday2');
	$('.material_holiday_nav>.hover-line', self).css({
		width: $('.mth_filter.active', self).outerWidth(),
		left: $('.mth_filter.active', self).position().left
	});

	var editor = typeof current_editor != 'undefined' ? current_editor : undefined;

	;(function(ed) {

		$('.material_holiday_list', self).mixItUp({
			layout: {
				display: 'block'
			},
			load: {
				filter: '.mix'
			},
			selectors: {
				filter: '.js_mt_filter',
			},
			callbacks: {
				onMixStart: function(e, state) {
					$('.material_holiday_container', self).scrollTop(0);
					return true;
				}
			}
		}).on('click', '>li', function() {
			if (ed) {
				ed.execCommand('inserthtml', $(this).html());
			}
		});
		self.on('click', '.js_mth_filter', function() {
			$(this).addClass('active').siblings().removeClass('active');
			$('.material_holiday_nav>.hover-line', self).css({
				width: $('.mth_filter.active', self).outerWidth(),
				left: $('.mth_filter.active', self).position().left
			});
			$('.material_holiday_container>*', self).eq($(this).index() - 1).show().siblings().hide();
		}).on('click', '.img_container img', function() {
			if (ed) {
				ed.execCommand('inserthtml', '<img alt="' + (this.title || '') + '" src="' + $(this).attr('editor_url') + '"><br/>');
			}
		});
		$('.material_holiday_list img').each(function(){
			if ($(this).prop('src').indexOf('imgcdn.wxeditor.com') > -1) {
			}
		});
		$('.js_material_container .js_mt_filter:first-child').addClass('selected');
	}(editor));
});
</script>